"> d> e>Nexus Report l> " > " > "> e>Midscene Visualizer e> /* src/index.less */ html, body { padding: 0; margin: 0; line-height: 1; } .rspress-nav { transition: 0.2s; } :root { --modern-sidebar-width: 0 !important; --modern-aside-width: 0 !important; --modern-preview-padding: 0 !important; } .modern-doc-layout, .modern-doc { width: 100% !important; margin: 0 !important; padding: 0 !important; height: 100vh; } .modern-sidebar, header.w-full { display: none !important; } .modern-doc-container { padding: 0 !important; } footer.mt-8 { display: none; } .page-container { display: flex; flex-direction: column; height: 100%; color: #3b3b3b; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; font-size: 14px; border-top: 1px solid #E5E5E5; border-bottom: 1px solid #E5E5E5; font-synthesis: style; text-rendering: optimizelegibility; -webkit-font-smoothing: antialiased; line-height: 1.5; } .page-container blockquote, .page-container dl, .page-container dd, .page-container h1, .page-container h2, .page-container h3, .page-container h4, .page-container h5, .page-container h6, .page-container hr, .page-container figure, .page-container p, .page-container pre { margin: 0; } .page-side { border-right: 1px solid #E5E5E5; height: 100%; } .page-nav { height: 30px; padding: 10px; border-bottom: 1px solid #E5E5E5; display: flex; flex-direction: row; background: #F8F8F8; } .page-nav .page-nav-left { display: flex; flex-direction: row; } .page-nav .page-nav-toolbar { margin-left: 20px; } .page-nav .page-nav-toolbar .ant-btn { background: #E9E9E9; } .page-nav .playwright-case-selector { margin-left: 16px; line-height: 30px; } .cost-str { color: #777; } .ant-layout { flex-grow: 1; height: 100%; } .main-right { display: flex; flex-direction: column; width: 100%; height: 100%; box-sizing: border-box; } .main-right .replay-all-mode-wrapper { height: 100%; display: flex; flex-direction: column; justify-content: center; padding: 22px; box-sizing: border-box; margin: 0 auto; } .main-right .main-content { display: flex; flex-direction: row; flex-grow: 1; overflow: hidden; background: #FFF; } .main-right.uploader-wrapper { box-sizing: border-box; margin: auto; max-width: 800px; flex-direction: column; justify-content: center; } .main-right.uploader-wrapper .uploader { width: 100%; } .main-right.uploader-wrapper .demo-loader { width: 100%; text-align: center; margin-top: 10px; } .main-right .main-content-container { flex-grow: 1; height: 100%; background: #ffffff; overflow: hidden; border-right: 1px solid #E5E5E5; } .main-right .main-side { box-sizing: border-box; overflow-y: scroll; height: 100%; } .main-right .json-content { word-wrap: break-word; white-space: pre-wrap; } /* src/component/detail-side.less */ .detail-side h2 { padding-top: 0; margin-top: 0; margin-bottom: 4px; } .detail-side .ant-tag { margin-top: 2px; } .detail-side .meta-kv { padding: 10px 10px calc(10px + 4px); overflow: hidden; } .detail-side .meta-kv .meta { box-sizing: border-box; padding: 2px 0; width: 100%; display: flex; flex-direction: row; line-height: 1.5; } .detail-side .meta-kv .meta .meta-key { width: 100px; text-align: right; padding-right: 16px; flex-shrink: 0; } .detail-side .meta-kv .meta .meta-value { flex: 1 1; } .detail-side .item-list { padding: 10px 10px; cursor: default; margin-bottom: 10px; } .detail-side .item-list .item { padding: 16px 10px 10px; transition: 0.1s; border: 1px solid #DDD; border-radius: 5px; margin-bottom: 10px; position: relative; } .detail-side .item-list .item.item-lite { border: none; padding: 0; } .detail-side .item-list .item-highlight { color: #FFF; } .detail-side .item-list .item-highlight .subtitle { color: #CCC; } .detail-side .item-list .item-extra { position: absolute; right: 10px; top: 10px; color: #777; } .detail-side .item-list .title-right-padding { padding-right: 15px; } .detail-side .item-list .title { font-size: 18px; font-weight: bold; margin-bottom: 5px; } .detail-side .item-list .title .title-tag { display: inline-block; margin-left: 6px; color: #777; font-size: 14px; line-height: 18px; } .detail-side .item-list .subtitle { font-weight: normal; font-size: 14px; color: #777; } .detail-side .item-list .description { margin-top: 5px; } .detail-side .item-list .description-content { font-size: 14px; margin-top: 10px; white-space: break-spaces; word-wrap: break-word; margin: 0; } .detail-side .item-list .element-button:hover { color: #fff; background: #F9483E; } .detail-side .item-list .section-button:hover { color: #fff; background: #01204E; } .detail-side pre { text-wrap: balance; } .detail-side .item-list-space-up { margin-top: 10px; } /* src/component/panel-title.less */ .panel-title { background: #F8F8F8; border-top: 1px solid #E5E5E5; border-bottom: 1px solid #E5E5E5; margin-top: -1px; padding: 2px 10px; } .panel-title .task-list-name { font-weight: bold; } /* src/component/player.less */ .player-container { width: fit-content; max-width: 100%; max-height: 100%; padding: 12px 0; padding-bottom: 0; background: #434443DD; box-sizing: border-box; border: 1px solid #979797; border-radius: 6px; line-height: 100%; margin: 0 auto; display: flex; flex-direction: column; overflow: hidden; } .player-container .canvas-container { flex-grow: 1; display: flex; align-items: center; justify-content: center; overflow: hidden; padding: 0 12px; } .player-container .canvas-container canvas { max-width: 100%; max-height: 100%; box-sizing: border-box; display: block; margin: 0 auto; } .player-container .player-timeline { width: 100%; height: 4px; background: #666; position: relative; margin-top: -2px; } .player-container .player-timeline .player-timeline-progress { transition-timing-function: linear; position: absolute; top: 0; left: 0; height: 4px; background: #06b1ab; } .player-container .player-tools { margin-top: 15px; margin-bottom: 15px; max-width: 100%; overflow: hidden; color: #FFF; font-size: 16px; box-sizing: border-box; display: flex; flex-direction: row; padding: 0 12px; justify-content: space-between; height: 40px; flex-shrink: 0; } .player-container .player-tools .player-control { flex-grow: 1; display: flex; flex-direction: row; align-items: left; } .player-container .player-tools .status-icon { transition: 0.2s; width: 40px; height: 40px; margin-right: 12px; background: #666; border-radius: 6px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .player-container .player-tools .status-text { flex-grow: 1; overflow: hidden; position: relative; } .player-container .player-tools .title { font-weight: bold; height: 20px; line-height: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; position: absolute; top: 0; left: 0; width: 100%; } .player-container .player-tools .subtitle { height: 20px; line-height: 20px; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; position: absolute; top: 18px; left: 0; } .player-container .player-tools .player-tools-item { height: 100%; display: flex; flex-direction: column; justify-content: center; } .player-container .player-tools .player-tools-item .ant-btn-variant-link { color: #FFF; } /* src/component/sidebar.less */ .side-bar { display: flex; flex-direction: column; justify-content: space-between; width: 100%; height: 100%; overflow: auto; background: #F8F8F8; box-sizing: border-box; } .side-bar .task-meta-section { margin-top: 6px; } .side-bar .task-meta { color: #777; font-weight: normal; padding-left: 10px; } .side-bar .side-seperator { border-top: 1px solid none; } .side-bar .side-seperator.side-seperator-line { border-top: 1px solid #E5E5E5; } .side-bar .side-seperator.side-seperator-space-up { margin-top: 10px; } .side-bar .side-seperator.side-seperator-space-down { margin-bottom: 10px; } .side-bar .side-sub-title { padding: 0 10px; margin-bottom: 6px; } .side-bar .name-status { font-size: 12px; display: inline-block; margin-right: 6px; } .side-bar .side-item { cursor: pointer; transition: 0.1s; padding: 2px 0 2px 28px; } .side-bar .side-item:hover { background: #dcdcdc80; } .side-bar .side-item.selected { background: #bfc4da80; } .side-bar .side-item .side-item-content { padding: 0 10px 0 calc(10px + 10px); } .side-bar .side-item-name { padding: 0 10px 0 calc(10px + 10px); position: relative; display: flex; justify-content: space-between; } .side-bar .side-item-name .status-icon { position: absolute; left: 0; display: inline-block; color: #AAA; font-size: 12px; line-height: 10px; top: 50%; margin-top: -5px; } .side-bar .side-item-name .status-text { color: #777; } .side-bar .bottom-controls { padding: 10px 10px; text-align: left; text-align: center; } /* src/component/detail-panel.less */ .detail-panel { display: flex; flex-direction: column; height: 100%; box-sizing: border-box; padding: 10px; background: #FFF; } .detail-panel .scrollable { height: 100%; overflow: auto; } .detail-panel .view-switcher { margin-bottom: 10px; flex-shrink: 0; display: flex; justify-content: space-between; flex-direction: row; } .detail-panel .detail-content { box-sizing: border-box; justify-content: center; flex-direction: column; display: flex; flex-grow: 1; height: 100%; overflow: hidden; } .detail-panel .blackboard { margin: 0 auto; } .detail-panel .screenshot-item-wrapper { display: flex; flex-wrap: wrap; justify-content: space-around; align-items: center; } .detail-panel .screenshot-item { margin-bottom: 10px; } .detail-panel .screenshot-item .screenshot-item-title { margin-bottom: 5px; } .detail-panel .screenshot-item img { border: 1px solid #888; max-width: 100%; max-height: 720px; box-sizing: border-box; } /* src/component/blackboard.less */ .blackboard .footer { color: #aaa; } .blackboard ul { padding-left: 0px; } .blackboard li { list-style: none; } .blackboard .bottom-tip { height: 30px; } .blackboard .bottom-tip-item { max-width: 500px; color: #AAA; text-overflow: ellipsis; word-wrap: break-word; } .blackboard-filter { margin: 10px 0; } .blackboard-main-content canvas { width: 100%; border: 1px solid #888; box-sizing: border-box; } /* src/component/playground-component.less */ body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; font-size: 14px; } .playground-container { width: 100%; height: 100%; } .playground-container.vertical-mode { height: inherit; } .playground-container.vertical-mode .form-part { margin-bottom: 15px; } .playground-container.vertical-mode .form-part h3 { font-size: 14px; line-height: 1.6; } .playground-container .playground-header { padding: 10px 10px 30px; } .playground-container .playground-left-panel { width: 100%; height: 100%; background-color: #FFF; display: flex; flex-direction: column; justify-content: space-between; overflow-y: auto !important; } .playground-container .playground-left-panel .ant-form { height: 100%; flex-grow: 1; display: flex; flex-direction: column; justify-content: center; } .playground-container .form-part { margin-bottom: 20px; padding: 0 20px; } .playground-container .form-part h3 { margin-top: 0; margin-bottom: 12px; font-size: 18px; } .playground-container .form-part .switch-btn-wrapper { margin-left: 2px; } .playground-container .input-wrapper { box-sizing: border-box; } .playground-container .input-wrapper .main-side-console-input { position: relative; margin-top: 4px; } .playground-container .input-wrapper .ant-input { padding-bottom: 40px; } .playground-container .input-wrapper .form-controller-wrapper { position: absolute; bottom: 8px; padding: 0 12px; left: 0px; display: flex; flex-direction: row; justify-content: space-between; width: 100%; box-sizing: border-box; align-items: flex-end; gap: 8px; } .playground-container .input-wrapper .settings-wrapper { display: flex; flex-direction: row; gap: 2px; color: #777; flex-wrap: wrap; } .playground-container .input-wrapper .settings-wrapper.settings-wrapper-hover { color: #3b3b3b; } .playground-container .input-wrapper .history-selector { margin-right: 8px; } .playground-container .loading-container { display: flex; flex-direction: column; align-items: center; box-sizing: border-box; padding: 20px 20px; } .playground-container .loading-container .loading-progress-text { text-align: center; width: 100%; color: #777; margin-top: 16px; } .playground-container .loading-container .loading-progress-text-tab-info { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .playground-container .loading-container .loading-progress-text-progress { height: 60px; } .playground-container .result-wrapper { width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; padding: 20px 20px; background-color: #F8F8F8; border-radius: 4px; } .playground-container .result-wrapper.result-wrapper-compact { padding: 0; } .playground-container .result-wrapper.vertical-mode-result { height: inherit; min-height: 300px; } .playground-container .result-wrapper .result-empty-tip { text-align: center; width: 100%; color: #CCC; } .playground-container .result-wrapper pre { display: block; word-wrap: break-word; white-space: pre-wrap; } /* src/component/logo.less */ .logo img { height: 30px; line-height: 30px; vertical-align: baseline; vertical-align: -webkit-baseline-middle; } .logo-with-star-wrapper { display: flex; flex-direction: row; justify-content: space-between; } .logo-with-star-wrapper .github-star { height: 22px; } /* src/component/open-in-playground.less */ .playground-drawer .ant-drawer-body { padding: 0; } /* src/component/global-hover-preview.less */ .global-hover-preview { position: fixed; display: block; max-width: 400px; max-height: 400px; overflow: hidden; z-index: 10; text-align: center; border: 1px solid #E5E5E5; box-sizing: border-box; background: #F8F8F8; box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.2); } .global-hover-preview img { max-width: 400px; max-height: 400px; width: auto; height: auto; } /* src/component/timeline.less */ .timeline-wrapper { flex-basis: 110px; flex-grow: 0; flex-shrink: 0; width: 100%; height: 100%; border-bottom: 1px solid #E5E5E5; position: relative; box-sizing: border-box; } .timeline-wrapper .timeline-canvas-wrapper { width: 100%; height: 100%; } .timeline-wrapper canvas { width: 100%; height: 100%; }
">